/**
* 共用样式 _public.scss
*   author:sjl
   
*/
// @import "_normal";

$bg-color:#eff1f3;
$main-color:#00c472;

$border-color:#e0e0e0;
$font-color:#000;
$font-color1:#999;
$font-color2:#666;
$font-color3:#333;

$key-color:#ffd300;

//宽高
@mixin elementSize($w, $h) {
  width: $w;
  height: $h;
}

//旋转
@mixin transformRotate($angle, $x, $y) {
  transform: rotate($angle);
  -ms-transform: rotate($angle);
  /* IE 9 */
  -webkit-transform: rotate($angle);
  /* Safari and Chrome */
  -o-transform: rotate($angle);
  /* Opera */
  -moz-transform: rotate($angle);
  /* Firefox */
  transform-origin: $x $y; //旋转中心
  -ms-transform-origin: $x $y;
  -webkit-transform-origin: $x $y;
  -o-transform-origin: $x $y;
  -moz-transform-origin: $x $y;
}

//flex布局,方向
@mixin flexBox($dire) {
  display: box;
  display: -webkit-box;
  /* iOS 6-, Safari 3.1-6 */
  display: -moz-box;
  /* Firefox 19 */
  display: -ms-flexbox;
  display: -webkit-flex;
  /* Chrome */
  display: flex;
  -webkit-flex-direction: $dire;
  flex-direction: $dire;
  -moz-flex-direction: $dire;
  -ms-flex-direction: $dire;
  -o-flex-direction: $dire;
}

// 居中
@mixin center($p, $t, $l, $x, $y) {
  position: $p;
  top: $t;
  left: $l;
  transform: translate($x, $y);
  -ms-transform: translate($x, $y);
  /* IE 9 */
  -webkit-transform: translate($x, $y);
  /* Safari and Chrome */
  -o-transform: translate($x, $y);
  /* Opera */
  -moz-transform: translate($x, $y);
  /* Firefox */
}

//单行省略号
@mixin line-ellipsis() {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

//单行省略号
@mixin multiline-ellipsis($x) {
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: $x;
  overflow: hidden;

}

// 公用背景
html,
body,
#app,
.view {
  @include elementSize(100%, 100%);
  -webkit-overflow-scrolling: touch;
}

body {
  font-size: 0.3rem;
  position: relative;
  background: #fff;
}
